<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>视频播放</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">

        <div> <a href="/" class="back-button">返回列表</a></div>
        <video id="video-player" controls autoplay style="width: 100%;">
            <source id="video-source" type="video/mp4">
            浏览器不支持视频播放
        </video>
        <div id="name"></div>
        <p>视频简介：</p>
        <div id="desc"></div>
       
    </div>
    <script>
        const urlParams = new URLSearchParams(window.location.search);
        const videoUrl = urlParams.get('v');
        getVideoInfo(videoUrl)
        document.getElementById('video-source').src = videoUrl;
        document.getElementById('video-player').load();

        function getVideoInfo(url) {
            fetch('/api/info?v=' + encodeURIComponent(url))
            .then(response => response.json())
            .then(res => {
                let data = res.data;
                document.getElementById('name').innerText = data.name
                document.getElementById('desc').innerText = data.desc
            })
        }
    </script>
</body>
</html>